<template>
  <div class="container">
    <!-- 标题：近期会议 -->
    <h2 class="mx-1" type="info" size="large">近期会议</h2>
    <!-- 下拉菜单：会议模式 -->
    <el-dropdown class="mode-button">
      <el-button type="primary" plain>
        {{ selectedOption }}<el-icon class="el-icon--right"><arrow-down /></el-icon>
      </el-button>
      <template #dropdown>
        <el-dropdown-menu>
          <el-dropdown-item
            v-for="option in options"
            :key="option"
            @click="handleSelectOption(option)"
          >
            {{ option }}
          </el-dropdown-item>
        </el-dropdown-menu>
      </template>
    </el-dropdown>
    <el-button class="refreshRight" circle @click="refreshRightMeeting">
      <el-icon><RefreshRight /></el-icon>
    </el-button>
    <!-- <el-icon class="refreshRight"><RefreshRight /></el-icon> -->
    <!-- 卡片:近期会议 -->
    <el-space
      wrap
      class="recent-meeting"
      style="width: 150vh; overflow-x: auto; padding-bottom: 1vh"
    >
      <div
        class="recent-meeting-content"
        style="display: flex; width: 100%; max-height: 18vh"
      >
        <!-- 当没有会议数据时显示占位 -->
        <el-empty
          v-if="filteredMeetings.length === 0"
          description="暂无近期会议"
          :image-size="100"
          style="width: 150vh"
        />
        <!-- 有会议数据 -->
        <el-card
          v-for="(meeting, index) in filteredMeetings"
          :key="index"
          class="box-card"
          style="height: 17vh; margin-right: 10px"
          :class="{
            'online-card': meeting.meetingType === '线上',
            'offline-card': meeting.meetingType === '线下',
          }"
        >
          <!-- 卡片头部 -->
          <template #header>
            <div
              class="card-header"
              style="
                display: flex;
                justify-content: space-between;
                align-items: center;
                width: 100%;
                height: 1vh;
              "
            >
              <span>{{ meeting.meetingSubject }}</span>
              <span
                :class="{
                  'status-blue': meeting.meetingStatus === '未开始',
                  'status-green': meeting.meetingStatus === '进行中',
                  'status-red': meeting.meetingStatus === '已结束',
                }"
                >{{ meeting.meetingStatus }}</span
              >
            </div>
          </template>
          <!-- 卡片底部 -->
          <div>
            <!-- 会议内容 -->
            <div
              style="
                display: flex;
                justify-content: space-between;
                height: 4vh;
                align-items: center;
                width: 100%;
                box-sizing: border-box;
              "
            >
              <el-text
                class="mx-11"
                style="
                  flex: 1;
                  min-width: 0;
                  overflow: hidden;
                  text-overflow: ellipsis;
                  white-space: nowrap;
                  text-align: left;
                "
                >{{ meeting.meetingDescription }}
              </el-text>
              <!-- 处理会议状态和redis缓存不同情况的按钮显示 -->
              <div
                class="status-select"
                style="display: flex; flex-shrink: 0; margin-left: auto"
              >
                <el-text
                  class="mx-11"
                  style="
                    flex: 1;
                    min-width: 0;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    text-align: left;
                  "
                  :class="'status-yellow'"
                >
                  {{ meeting.isCache === 1 ? "请您邀请参会者" : "" }}
                </el-text>
                <div class="line" v-if="meeting.isCache === 1" />
                <el-button
                  v-if="meeting.meetingStatus !== '已结束' && meeting.isCache !== 1"
                  :class="{
                    'status-blue':
                      meeting.meetingStatus === '未开始' ||
                      meeting.meetingStatus === '进行中',
                  }"
                  class="mx-11"
                  style="display: block; text-align: left"
                  type="primary"
                  plain
                  @click="entryMeeting(meeting.meetingId)"
                >
                  {{
                    meeting.meetingStatus === "未开始" ||
                    meeting.meetingStatus === "进行中"
                      ? "进入会议"
                      : ""
                  }}
                </el-button>
                <!-- 查看按钮 -->
                <el-button
                  :key="meeting.meetingId"
                  :class="{
                    'status-yellow':
                      meeting.meetingStatus === '未开始' && meeting.isCache === 1,
                    'status-gray':
                      meeting.meetingStatus === '未开始' && meeting.isCache === 0,
                    'status-gray': meeting.meetingStatus === '进行中',
                    'status-gray': meeting.meetingStatus === '已结束',
                  }"
                  class="mx-11"
                  style="display: block; text-align: left"
                  @click="fetchMeetingDetail(meeting.meetingId)"
                  plain
                >
                  {{
                    meeting.meetingStatus === "未开始" ||
                    meeting.meetingStatus === "进行中" ||
                    meeting.meetingStatus === "已结束"
                      ? "查看"
                      : ""
                  }}
                </el-button>
              </div>
            </div>
            <div style="display: flex; justify-content: space-between; height: 5vh">
              <!-- 会议开始时间 -->
              <div style="display: flex; align-items: center; gap: 4px">
                <el-icon>
                  <Timer />
                </el-icon>
                <el-text class="mx-11">{{ meeting.meetingStartTime }}</el-text>
              </div>
              <!-- 会议地点 -->
              <el-text class="mx-11" size="large" style="padding-bottom: 0.5vh">{{
                meeting.meetingPlace
              }}</el-text>
              <!-- 会议主持人 -->
              <el-text class="mx-11">{{ meeting.creatorName }}</el-text>
            </div>
          </div>
        </el-card>
      </div>
    </el-space>
    <!-- 分页：近期会议 -->
    <div style="display: abosulte; margin-top: 25vh; margin-left: 25vh">
      <el-pagination
        background
        layout="prev, pager, next"
        :total="filteredMeetingsTotal"
        :page-size="pageSize"
        :current-page="currentPage"
        :pager-count="11"
        @current-change="handlePageChange"
      />
    </div>
    <!-- 弹出层-会议信息查看 -->
    <el-dialog
      v-model="dialogMeetingDetail"
      title="会议详细信息"
      width="60%"
      :close-on-click-modal="false"
      class="custom-dialog"
      draggable
    >
      <!-- 会议数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>会议数据</h3>
        <el-form-item label="会议主题">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.meeting.meetingSubject"
            maxlength="30"
            show-word-limit
            :disabled="dialogIsDisabled"
          ></el-input>
        </el-form-item>
        <el-form-item label="会议描述">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.meeting.meetingDescription"
            maxlength="50"
            show-word-limit
            :disabled="dialogIsDisabled"
          ></el-input>
        </el-form-item>
        <el-form-item label="会议进入时间">
          <div class="block">
            <el-date-picker
              v-model="meetingEntryTime"
              type="datetime"
              placeholder="选择会议进入时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="MMM DD, YYYY"
              time-format="HH:mm"
              :disabled="dialogIsDisabled"
            />
          </div>
        </el-form-item>
        <el-form-item label="会议时间范围">
          <div class="block">
            <el-date-picker
              v-model="meetingTimeRange"
              type="datetimerange"
              start-placeholder="选择会议开始时间"
              end-placeholder="选择会议结束时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="YYYY/MM/DD ddd"
              time-format="A hh:mm:ss"
              :disabled="dialogIsDisabled"
            />
          </div>
        </el-form-item>
        <el-form-item label="会议座位限制">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.meeting.meetingSeatLimit"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item label="是否录屏">
          <el-select
            v-model="currentMeeting.meeting.isScreencap"
            placeholder="是"
            style="width: 100px"
            :disabled="dialogIsDisabled"
          >
            <el-option
              v-for="item in isScreencapOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <!-- 通知数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>通知数据</h3>
        <el-form-item label="通知内容" style="">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.notification.notificationContent"
            maxlength="100"
            show-word-limit
            :disabled="dialogIsDisabled"
          ></el-input>
        </el-form-item>
        <el-form-item label="通知发送时间">
          <div class="block">
            <el-date-picker
              v-model="notificationSendTime"
              type="datetime"
              placeholder="选择通知发送时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="MMM DD, YYYY"
              time-format="HH:mm"
              :disabled="dialogIsDisabled"
            />
          </div>
        </el-form-item>
      </el-form>
      <!-- 参会数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>参会数据</h3>
        <el-form-item label="用户数据" style="margin-left: 3.5vh">
          <el-table
            :data="currentMeeting.participant"
            style="width: 100%"
            :cell-class-name="tableCell"
          >
            <el-table-column label="用户名" prop="username" />
            <el-table-column label="昵称" prop="nickname" />
            <el-table-column align="center">
              <template #header>
                <el-select
                  ref="userSelect"
                  multiple
                  filterable
                  remote
                  reserve-keyword
                  placeholder="请输入用户名搜索用户"
                  remote-show-suffix
                  :remote-method="userInfoSearch"
                  :loading="userInfoLoading"
                  @change="addParticipants"
                  style="max-width: 25vh"
                  :disabled="dialogIsDisabled"
                >
                  <el-option
                    v-for="item in userInfo"
                    :key="item.username"
                    :label="item.username"
                    :value="item.username"
                  />
                </el-select>
              </template>
              <template #default="scope">
                <el-button
                  size="small"
                  type="danger"
                  @click="deleteParticipate(scope.$index, scope.row)"
                  :disabled="dialogIsDisabled"
                >
                  删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
      <!-- 提交修改 -->
      <el-button
        type="success"
        plain
        style="width: 80vh"
        :disabled="dialogIsDisabled"
        @click="updateMeeting"
      >
        提交修改
      </el-button>
    </el-dialog>

    <!-- 标题：会议室预约 -->
    <h2 class="mx-2" type="info" size="large">会议室预约</h2>
    <!-- 卡片：创建线上会议 -->
    <el-space wrap class="create-online-meeting">
      <el-card class="box-card" style="width: 30vh; height: 18vh">
        <!-- 卡片头部 -->
        <template #header>
          <div
            class="card-header"
            style="
              display: block;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              height: 100%;
              line-height: 1vh;
            "
          >
            <span>创建会议</span>
          </div>
        </template>
        <!-- 卡片底部 -->
        <div>
          <!-- 介绍信息 -->
          <el-text
            class="mx-11"
            style="display: block; text-align: left; margin-bottom: 2vh"
            >线上会议</el-text
          >
          <div style="display: flex; justify-content: center">
            <!-- 按钮 -->
            <div style="display: flex; align-items: center; gap: 4px">
              <el-button
                type="primary"
                plain
                style="width: 26vh"
                @click="buttonCreateMeeting"
                >去创建会议</el-button
              >
            </div>
          </div>
        </div>
      </el-card>
    </el-space>
    <!-- 弹出层-创建会议 -->
    <el-dialog
      v-model="dialogCreateMeeting"
      title="创建会议"
      width="60%"
      :close-on-click-modal="false"
      class="custom-dialog"
      draggable
    >
      <!-- 会议数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>会议数据</h3>
        <el-form-item label="会议主题">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.meeting.meetingSubject"
            maxlength="30"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="会议描述">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.meeting.meetingDescription"
            maxlength="50"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="会议进入时间">
          <div class="block">
            <el-date-picker
              v-model="meetingEntryTime"
              type="datetime"
              placeholder="选择会议进入时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="MMM DD, YYYY"
              time-format="HH:mm"
            />
          </div>
        </el-form-item>
        <el-form-item label="会议时间范围">
          <div class="block">
            <el-date-picker
              v-model="meetingTimeRange"
              type="datetimerange"
              start-placeholder="选择会议开始时间"
              end-placeholder="选择会议结束时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="YYYY/MM/DD ddd"
              time-format="A hh:mm:ss"
            />
          </div>
        </el-form-item>
        <el-form-item label="会议座位限制">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.meeting.meetingSeatLimit"
          ></el-input>
        </el-form-item>
        <el-form-item label="是否录屏">
          <el-select
            v-model="currentMeeting.meeting.isScreencap"
            placeholder="是"
            style="width: 100px"
          >
            <el-option
              v-for="item in isScreencapOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <!-- 通知数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>通知数据</h3>
        <el-form-item label="通知内容" style="">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.notification.notificationContent"
            maxlength="100"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="通知发送时间">
          <div class="block">
            <el-date-picker
              v-model="notificationSendTime"
              type="datetime"
              placeholder="选择通知发送时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="MMM DD, YYYY"
              time-format="HH:mm"
            />
          </div>
        </el-form-item>
      </el-form>
      <!-- 参会数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>参会数据</h3>
        <el-form-item label="用户数据" style="margin-left: 3.5vh">
          <el-table
            :data="currentMeeting.participant"
            style="width: 100%"
            :cell-class-name="tableCell"
          >
            <el-table-column label="用户名" prop="username" />
            <el-table-column label="昵称" prop="nickname" />
            <el-table-column align="center">
              <template #header>
                <el-select
                  ref="userSelect"
                  multiple
                  filterable
                  remote
                  reserve-keyword
                  placeholder="请输入用户名搜索用户"
                  remote-show-suffix
                  :remote-method="userInfoSearch"
                  :loading="userInfoLoading"
                  @change="addParticipants"
                  style="max-width: 25vh"
                >
                  <el-option
                    v-for="item in userInfo"
                    :key="item.username"
                    :label="item.username"
                    :value="item.username"
                  />
                </el-select>
              </template>
              <template #default="scope">
                <el-button
                  size="small"
                  type="danger"
                  @click="deleteParticipate(scope.$index, scope.row)"
                >
                  删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
      <!-- 提交创建 -->
      <el-button type="success" plain style="width: 80vh" @click="createMeeting">
        提交创建
      </el-button>
    </el-dialog>

    <!-- 卡片：线下会议室申请 -->
    <el-space wrap class="create-offline-meeting">
      <el-card class="box-card" style="width: 30vh; height: 18vh">
        <!-- 卡片头部 -->
        <template #header>
          <div
            class="card-header"
            style="
              display: block;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              height: 100%;
              line-height: 1vh;
            "
          >
            <span>申请会议室</span>
          </div>
        </template>
        <!-- 卡片底部 -->
        <div>
          <!-- 介绍信息 -->
          <el-text
            class="mx-11"
            style="display: block; text-align: left; margin-bottom: 2vh"
            >线下会议</el-text
          >
          <div style="display: flex; justify-content: center">
            <!-- 按钮 -->
            <div style="display: flex; align-items: center; gap: 4px">
              <el-button
                type="primary"
                plain
                style="width: 26vh"
                @click="buttonOfflineCreateMeeting"
                >去申请会议室</el-button
              >
            </div>
          </div>
        </div>
      </el-card>
    </el-space>
    <!-- 弹出层-线下会议申请 -->
    <el-dialog
      v-model="dialogOfflineCreateMeeting"
      title="线下会议室申请"
      width="60%"
      :close-on-click-modal="false"
      class="custom-dialog"
      draggable
    >
      <!-- 会议数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>会议数据</h3>
        <el-form-item label="会议主题">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.meeting.meetingSubject"
            maxlength="30"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="会议描述">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.meeting.meetingDescription"
            maxlength="50"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="会议进入时间">
          <div class="block">
            <el-date-picker
              v-model="meetingEntryTime"
              type="datetime"
              placeholder="选择会议进入时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="MMM DD, YYYY"
              time-format="HH:mm"
            />
          </div>
        </el-form-item>
        <el-form-item label="是否录屏">
          <el-select
            v-model="currentMeeting.meeting.isScreencap"
            placeholder="是"
            style="width: 100px"
          >
            <el-option
              v-for="item in isScreencapOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <!-- 通知数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>通知数据</h3>
        <el-form-item label="通知内容" style="">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.notification.notificationContent"
            maxlength="100"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="通知发送时间">
          <div class="block">
            <el-date-picker
              v-model="notificationSendTime"
              type="datetime"
              placeholder="选择通知发送时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="MMM DD, YYYY"
              time-format="HH:mm"
            />
          </div>
        </el-form-item>
      </el-form>
      <!-- 参会数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>参会数据</h3>
        <el-form-item label="用户数据" style="margin-left: 3.5vh">
          <el-table
            :data="currentMeeting.participant"
            style="width: 100%"
            :cell-class-name="tableCell"
          >
            <el-table-column label="用户名" prop="username" />
            <el-table-column label="昵称" prop="nickname" />
            <el-table-column align="center">
              <template #header>
                <el-select
                  ref="userSelect"
                  multiple
                  filterable
                  remote
                  reserve-keyword
                  placeholder="请输入用户名搜索用户"
                  remote-show-suffix
                  :remote-method="userInfoSearch"
                  :loading="userInfoLoading"
                  @change="addParticipants"
                  style="max-width: 25vh"
                >
                  <el-option
                    v-for="item in userInfo"
                    :key="item.username"
                    :label="item.username"
                    :value="item.username"
                  />
                </el-select>
              </template>
              <template #default="scope">
                <el-button
                  size="small"
                  type="danger"
                  @click="deleteParticipate(scope.$index, scope.row)"
                >
                  删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
      <!-- 会议室数据 -->
      <el-form style="text-align: left" label-width="auto">
        <h3>会议室数据</h3>
        <!-- <el-form-item label="会议室ID" style="">
          <el-input class="dialog-input" v-model="currentMeeting.room.roomId" maxlength="100"
            show-word-limit disabled></el-input>
        </el-form-item>
        <el-form-item label="会议地点" style="">
          <el-input class="dialog-input" v-model="currentMeeting.room.meetingPlace" maxlength="100"
            show-word-limit></el-input>
        </el-form-item> -->
        <el-form-item label="会议地点/会议室号" style="">
          <el-select
            ref="placeSelect"
            v-model="selectedPlace"
            filterable
            remote
            reserve-keyword
            placeholder="请输入地点搜索会议室"
            remote-show-suffix
            :remote-method="placeInfoSearch"
            @change="addPlace"
            style="max-width: 25vh"
          >
            <el-option
              v-for="item in placeInfo"
              :key="item.id"
              :label="item.locationNum"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="会议室号" style="">
          <el-input class="dialog-input" v-model="currentMeeting.room.meetingNum" maxlength="100"
            show-word-limit></el-input>
        </el-form-item> -->
        <el-form-item label="会议时间范围">
          <div class="block">
            <el-date-picker
              v-model="meetingTimeRange"
              type="datetimerange"
              start-placeholder="选择会议开始时间"
              end-placeholder="选择会议结束时间"
              format="YYYY-MM-DD HH:mm:ss"
              date-format="YYYY/MM/DD ddd"
              time-format="A hh:mm:ss"
            />
          </div>
        </el-form-item>
        <el-form-item label="会议座位限制">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.room.meetingSeatLimit"
          ></el-input>
        </el-form-item>
        <el-form-item label="用途说明">
          <el-input
            class="dialog-input"
            v-model="currentMeeting.room.description"
          ></el-input>
        </el-form-item>
      </el-form>
      <!-- 提交审批 -->
      <el-button type="success" plain style="width: 80vh" @click="offlineCreateMeeting">
        提交审批
      </el-button>
    </el-dialog>

    <!-- 卡片：会议室审批 -->
    <el-space wrap class="select-offline-meeting">
      <el-card class="box-card" style="width: 30vh; height: 18vh">
        <!-- 卡片头部 -->
        <template #header>
          <div
            class="card-header"
            style="
              display: block;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              height: 100%;
              line-height: 1vh;
            "
          >
            <span>会议室审批</span>
          </div>
        </template>
        <!-- 卡片底部 -->
        <div>
          <!-- 介绍信息 -->
          <el-text
            class="mx-11"
            style="display: block; text-align: left; margin-bottom: 2vh"
            >查询审批进度</el-text
          >
          <div style="display: flex; justify-content: center">
            <!-- 按钮 -->
            <div style="display: flex; align-items: center; gap: 4px">
              <el-button
                type="primary"
                plain
                style="width: 26vh"
                @click="buttonOfflineSelectSchedule"
                >去查询进度</el-button
              >
            </div>
          </div>
        </div>
      </el-card>
    </el-space>
    <!-- 弹出层-查询审批进度 -->
    <el-dialog
      v-model="dialogOfflineSelectSchedule"
      title="查询审批进度"
      width="90%"
      :close-on-click-modal="false"
      class="custom-dialog"
      draggable
      style="overflow: auto"
    >
      <!-- 会议室数据 -->
      <el-form style="text-align: left; max-height: 400px" label-width="auto">
        <el-form-item style="margin-left: 3.5vh">
          <el-table :data="applicationInfo" style="width: 100%">
            <el-table-column
              label="会议室申请ID"
              prop="id"
              width="150"
              align="center"
              disabled
            />
            <el-table-column
              label="会议地点"
              prop="room.location"
              width="150"
              align="center"
              disabled
            />
            <el-table-column
              label="会议室号"
              prop="room.num"
              width="150"
              align="center"
              disabled
            />
            <el-table-column
              label="会议时间范围"
              prop="meetingRange"
              width="500"
              align="center"
              disabled
            >
              <template #default="scope">
                <el-date-picker
                  v-model="scope.row.applicationTimeRange"
                  type="datetimerange"
                  start-placeholder="会议开始时间"
                  end-placeholder="会议结束时间"
                  format="YYYY-MM-DD HH:mm:ss"
                  date-format="YYYY/MM/DD ddd"
                  time-format="A hh:mm:ss"
                  disabled
                />
              </template>
            </el-table-column>
            <el-table-column
              label="审批状态"
              prop="applicationStatus"
              width="150"
              align="center"
              disabled
            >
              <template #default="scope">
                {{ formattedApplicationStatus(scope.row.applicationStatus) }}
              </template>
            </el-table-column>
            <el-table-column label="会议进入时间" width="300" align="center">
              <template #default="scope">
                <el-date-picker
                  v-model="scope.row.approvalTime"
                  type="datetime"
                  placeholder="会议进入时间"
                  format="YYYY-MM-DD HH:mm:ss"
                  date-format="MMM DD, YYYY"
                  time-format="HH:mm"
                  disabled
                />
              </template>
            </el-table-column>
            <el-table-column
              label="审批人"
              prop="approvalName"
              width="150"
              align="center"
              disabled
            ></el-table-column>
            <el-table-column
              label="驳回理由"
              prop="rejectionReason"
              width="300"
              align="center"
              disabled
            ></el-table-column>
          </el-table>
        </el-form-item>
        <!-- 分页：审批进度(待修改) -->
        <el-pagination
          background
          layout="prev, pager, next"
          :total="filteredApplicationTotal"
          :page-size="applicationPageSize"
          :current-page="applicationCurrentPage"
          :pager-count="11"
          @current-change="applicationPageChange"
        />
      </el-form>
    </el-dialog>

    <!-- 标题：纪要管理 -->
    <h2 class="mx-3" type="info" size="large">纪要管理</h2>
    <!-- 卡片：纪要管理 -->
    <el-space wrap class="minutes-manage">
      <el-card class="box-card" style="width: 30vh; height: 18vh">
        <!-- 卡片头部 -->
        <template #header>
          <div
            class="card-header"
            style="
              display: block;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              height: 100%;
              line-height: 1vh;
            "
          >
            <span>纪要生成</span>
          </div>
        </template>
        <!-- 卡片底部 -->
        <div>
          <!-- 介绍信息 -->
          <el-text
            class="mx-11"
            style="display: block; text-align: left; margin-bottom: 2vh"
            >创建生成纪要的任务</el-text
          >
          <div style="display: flex; justify-content: center">
            <!-- 按钮 -->
            <div style="display: flex; align-items: center; gap: 4px">
              <el-button
                type="primary"
                plain
                style="width: 26vh"
                @click="buttonAssistance"
                >去生成纪要</el-button
              >
            </div>
          </div>
        </div>
      </el-card>
    </el-space>
    <!-- 弹出层-会议纪要生成 -->
    <el-dialog
      v-model="dialogAssistance"
      title="会议纪要生成"
      width="60%"
      :close-on-click-modal="false"
      class="custom-dialog"
      draggable
      style="overflow: auto"
    >
      <el-select v-model="valueAssistance" placeholder="选择会议" style="width: 240px">
        <el-option
          v-for="item in meetingDatas"
          :key="item.meetingId"
          :label="item.meetingSubject"
          :value="item.meetingId"
        >
          <span style="float: left">{{ item.meetingSubject }}</span>
          <span
            style="float: right; color: var(--el-text-color-secondary); font-size: 13px"
          >
            {{ item.meetingDescription }}
          </span>
        </el-option>
      </el-select>
      <!-- 调用后端生成纪要接口 -->
      <el-button type="success" plain @click="createTask" style="margin-left: 5vh"
        >点击生成纪要和摘要</el-button
      >
    </el-dialog>

    <!-- 卡片：纪要信息-->
    <el-space wrap class="minutes-manage-info">
      <el-card class="box-card" style="width: 30vh; height: 18vh">
        <!-- 卡片头部 -->
        <template #header>
          <div
            class="card-header"
            style="
              display: block;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              height: 100%;
              line-height: 1vh;
            "
          >
            <span>纪要生成进度</span>
          </div>
        </template>
        <!-- 卡片底部 -->
        <div>
          <!-- 介绍信息 -->
          <el-text
            class="mx-11"
            style="display: block; text-align: left; margin-bottom: 2vh"
            >查看纪要生成的进度</el-text
          >
          <div style="display: flex; justify-content: center">
            <!-- 按钮 -->
            <div style="display: flex; align-items: center; gap: 4px">
              <el-button
                type="primary"
                plain
                style="width: 26vh"
                @click="buttonSelectAssistance"
                >去查看纪要</el-button
              >
            </div>
          </div>
        </div>
      </el-card>
    </el-space>
    <!-- 弹出层-会议纪要信息 -->
    <el-dialog
      v-model="dialogSelectAssistance"
      title="会议纪要生成进度"
      width="80%"
      :close-on-click-modal="false"
      class="custom-dialog"
      draggable
      style="overflow: auto; min-height: 60vh; max-height: 100vh"
    >
      <el-select v-model="valueAssistance" placeholder="选择会议" style="width: 500px">
        <el-option
          v-for="item in meetingDatas"
          :key="item.meetingId"
          :label="item.meetingSubject"
          :value="item.meetingId"
        >
          <span style="float: left">{{ item.meetingSubject }}</span>
          <span
            style="float: right; color: var(--el-text-color-secondary); font-size: 13px"
          >
            {{ item.meetingDescription }}
          </span>
        </el-option>
      </el-select>
      <!-- 调用后端查询纪要接口 -->
      <el-button type="success" plain @click="getTaskInfo" style="margin-left: 5vh"
        >点击查看纪要和摘要生成进度</el-button
      >
      <!-- 摘要和纪要表格 -->
      <el-form v-if="showAssistance" style="text-align: left" label-width="auto">
        <h3>摘要纪要数据</h3>
        <el-form-item label="摘要信息" style="margin-left: 3.5vh">
          <el-table
            :data="[summarizationData]"
            style="width: 100%"
            :cell-class-name="tableCell"
          >
            <el-table-column label="全文标题" prop="ParagraphTitle" />
            <el-table-column label="全文总结" prop="ParagraphSummary" />
          </el-table>
        </el-form-item>

        <!-- 关键词表格 -->
        <el-form-item label="纪要关键词" style="margin-left: 3.5vh">
          <el-table
            :data="meetingAssistanceData.Keywords"
            style="width: 100%"
            :cell-class-name="tableCell"
          >
            <el-table-column label="关键词" prop="value" />
          </el-table>
        </el-form-item>

        <!-- 关键句子表格 -->
        <el-form-item label="纪要关键句" style="margin-left: 3.5vh">
          <el-table
            :data="meetingAssistanceData.KeySentences"
            style="width: 100%"
            :cell-class-name="tableCell"
          >
            <el-table-column label="关键句ID" prop="SentenceId" />
            <el-table-column label="关键句内容" prop="Text" />
          </el-table>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!-- 卡片：报道稿件生成-->
    <!-- <el-space wrap class="manuscript-info">
      <el-card class="box-card" style="width: 30vh; height: 18vh"> -->
    <!-- 卡片头部 -->
    <!-- <template #header>
          <div class="card-header" style="
              display: block;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              height: 100%;
              line-height: 1vh;
            ">
            <span>报道稿件生成</span>
          </div>
        </template> -->
    <!-- 卡片底部 -->
    <!-- <div> -->
    <!-- 介绍信息 -->
    <!-- <el-text class="mx-11" style="display: block; text-align: left; margin-bottom: 2vh">通过纪要生成报道稿件（参考）</el-text> -->
    <!-- <div style="display: flex; justify-content: center"> -->
    <!-- 按钮 -->
    <!-- <div style="display: flex; align-items: center; gap: 4px">
              <el-button type="primary" plain style="width: 26vh">去查看报道稿件</el-button>
            </div>
          </div>
        </div>
      </el-card>
    </el-space> -->
    <!-- 卡片：稿件生成进度-->
    <!-- <el-space wrap class="manuscript">
      <el-card class="box-card" style="width: 30vh; height: 18vh"> -->
    <!-- 卡片头部 -->
    <!-- <template #header>
          <div class="card-header" style="
              display: block;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              height: 100%;
              line-height: 1vh;
            ">
            <span>稿件生成进度</span>
          </div>
        </template> -->
    <!-- 卡片底部 -->
    <!-- <div> -->
    <!-- 介绍信息 -->
    <!-- <el-text class="mx-11" style="display: block; text-align: left; margin-bottom: 2vh">查看稿件生成进度（参考）</el-text>
          <div style="display: flex; justify-content: center"> -->
    <!-- 按钮 -->
    <!-- <div style="display: flex; align-items: center; gap: 4px">
              <el-button type="primary" plain style="width: 26vh">去生成报道稿件</el-button>
            </div>
          </div>
        </div>
      </el-card>
    </el-space> -->
  </div>
</template>

<script>
import { ref, computed, watch, onMounted } from "vue";
import { ArrowDown } from "@element-plus/icons-vue";
import moment from "moment";
import { ElMessage } from "element-plus";
import { useRouter } from "vue-router";
import axios from "axios";

export default {
  name: "dashboard",
  components: { ArrowDown },
  setup() {
    // 页面加载刷新数据
    onMounted(() => {
      console.log("刷新数据成功");

      init();
    });
    // 局部刷新
    const refreshRightMeeting = async () => {
      init();
    };
    const tableCell = ({ row, column, rowIndex, columnIndex }) => {
      // console.log("columnIndex", columnIndex);

      if (columnIndex === 0) {
        return "warning-cell";
      } else if (columnIndex === 1) {
        return "success-cell";
      }
      return "";
    };
    // 获取路由实例
    const router = useRouter();
    // 获取userId
    const userId = localStorage.getItem("userId");
    // 全部会议简要信息
    // const meetings = ref([
    //   {
    //     meetingId: 366370352715145676,
    //     meetingType: "线上",
    //     meetingNum: "ecm-153108703",
    //     meetingSubject: "你好",
    //     meetingDescription: "你好",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-05-10T08:00:00.000+08:00",
    //     meetingStartTime: "2025-05-10T08:20:00.000+08:00",
    //     meetingEndTime: "2025-05-10T08:30:00.000+08:00",
    //     meetingStatus: 0,
    //     meetingLink: null,
    //     isCache: 1,
    //     creatorName: "2",
    //   },
    //   {
    //     meetingId: "23593976317096211",
    //     meetingType: "线上",
    //     meetingNum: "ecm-991216667",
    //     meetingSubject: "培训",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-15T14:55:00.000+08:00",
    //     meetingStartTime: "2025-04-15T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-15T20:55:00.000+08:00",
    //     meetingStatus: 0,
    //     meetingLink: "23593976317096211",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "84874928986917039",
    //     meetingType: "线上",
    //     meetingNum: "ecm-625810564",
    //     meetingSubject: "培训",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-11T14:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 1,
    //     meetingLink: "84874928986917039",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线上",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线上",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线上",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 0,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线上",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线上",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训1",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线上",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训2",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线上",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训3",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线上",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训4",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线下",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训5",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //     meetingPlace: "科技楼1001",
    //   },
    //   {
    //     meetingId: "544654079935345089",
    //     meetingType: "线下",
    //     meetingNum: "ecm-630901536",
    //     meetingSubject: "培训6",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-08T18:55:00.000+08:00",
    //     meetingStartTime: "2025-04-11T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-11T20:55:00.000+08:00",
    //     meetingStatus: 2,
    //     meetingLink: "793779881341664478",
    //     isCache: 0,
    //     creatorName: "20210862224",
    //     meetingPlace: "科技楼1001",
    //   },
    // ]);
    const meetings = ref([]);
    // 会议模式
    const options = ref(["线上", "线下"]);
    // 选择会议模式
    const selectedOption = ref("线上");
    // 分页当前页
    const currentPage = ref(1);
    // 页码
    const pageSize = ref(3);
    // 处理选择会议模式
    const handleSelectOption = (option) => {
      selectedOption.value = option;
      currentPage.value = 1;
    };
    // 处理分页变化
    const handlePageChange = (page) => {
      currentPage.value = page;
    };
    // 初始化
    const init = async () => {
      try {
        const response = await axios
          .get("/meeting/meeting/online/queryAll/" + userId)
          .then((response) => {
            const data = response.data;
            if (data.code === 200) {
              meetings.value = data.data.meeting;
              console.log(meetings.value);
            }
          });
      } catch (error) {
        console.log(error);
      }
    };
    // 处理会议数据过滤，包含时间、缓存
    const filteredMeetings = computed(() => {
      const filtered = meetings.value
        .filter((meeting) => meeting.meetingType === selectedOption.value)
        .map((meeting) => ({
          ...meeting,
          meetingStartTime: moment(meeting.meetingStartTime).format(
            "YYYY-MM-DD HH:mm:ss"
          ),
          meetingEndTime: moment(meeting.meetingEndTime).format("YYYY-MM-DD HH:mm:ss"),
          meetingEntryTime: moment(meeting.meetingEntryTime).format(
            "YYYY-MM-DD HH:mm:ss"
          ),
          meetingStatus:
            meeting.meetingStatus === 0
              ? "未开始"
              : meeting.meetingStatus === 1
              ? "进行中"
              : "已结束",
        }));

      const start = (currentPage.value - 1) * pageSize.value;
      const end = start + pageSize.value;
      return filtered.slice(start, end);
    });
    // 处理模式不同的会议总数
    const filteredMeetingsTotal = computed(() => {
      return meetings.value.filter(
        (meeting) => meeting.meetingType === selectedOption.value
      ).length;
    });
    // 弹窗状态-会议详细信息
    const dialogMeetingDetail = ref(false);
    // 当前选中的会议
    // const currentMeeting = ref({
    //   meetingId: null,
    //   meetingType: null,
    //   meeting: {
    //     meetingNum: "ecm-991216667",
    //     meetingSubject: "培训",
    //     meetingDescription: "培训",
    //     meetingCreatorId: 797884113,
    //     meetingEntryTime: "2025-04-15T14:55:00.000+08:00",
    //     meetingStartTime: "2025-04-15T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-15T20:55:00.000+08:00",
    //     meetingStatus: 0,
    //     createTime: null,
    //     meetingSeatLimit: 100,
    //     meetingSceneType: "无",
    //     sponsorSigninStatus: 0,
    //     sponsorSigninTime: null,
    //     compereId: 797884113,
    //     isScreencap: 0,
    //     meetingLink: "23593976317096211",
    //   },
    //   notification: {
    //     notificationId: 351930797318,
    //     notificationContent: "Java培训",
    //     senderId: 797884113,
    //     sendTime: "2025-04-11T19:11:00.000+08:00",
    //     sendStatus: 0,
    //   },
    //   participant: [
    //     {
    //       userId: 432478646,
    //       username: "1",
    //       nickname: "2",
    //       joinTime: null,
    //     },
    //     {
    //       userId: 436170907,
    //       username: "3",
    //       nickname: "4",
    //       joinTime: null,
    //     },
    //     {
    //       userId: 313604140,
    //       username: "5",
    //       nickname: "6",
    //       joinTime: null,
    //     },
    //     {
    //       userId: 427388197,
    //       username: "7",
    //       nickname: "8",
    //       joinTime: null,
    //     },
    //   ],
    //   room: {
    //     roomId: "1",
    //     meetingPlace: "科技楼1001",
    //     meetingNum: "ecm-991216667",
    //     meetingSeatLimit: 100,
    //     meetingEntryTime: "2025-04-15T14:55:00.000+08:00",
    //     meetingStartTime: "2025-04-15T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-15T20:55:00.000+08:00",
    //   },
    //   place_id: [
    //     {
    //       value: '科技楼',
    //       label: '科技楼',
    //       children: [
    //         {
    //           value: '1001',
    //           label: '1001'
    //         },
    //         {
    //           value: '1002',
    //           label: '1002'
    //         },
    //       ],
    //     },
    //     {
    //       value: '博学楼',
    //       label: '博学楼',
    //       children: [
    //         {
    //           value: '501',
    //           label: '501'
    //         },
    //         {
    //           value: '506',
    //           label: '506'
    //         },
    //       ],
    //     },
    //   ],
    //   application: {
    //     applicationId: "1",
    //     meetingPlace: "",
    //     meetingNum: "",
    //     meetingStartTime: "2025-04-15T19:55:00.000+08:00",
    //     meetingEndTime: "2025-04-15T20:55:00.000+08:00",
    //     applicationStatus: "0",
    //     approvalTime: "2025-04-15T14:55:00.000+08:00",
    //     approvalName: "张三",
    //     rejectReason: "驳回"
    //   },
    //   isCache: 0,
    // });
    const currentMeeting = ref({});
    // 会议时间范围
    const meetingTimeRange = ref([]);
    // 会议进入时间
    const meetingEntryTime = ref();
    const isScreencapOptions = ref([
      {
        value: 1,
        label: "是",
      },
      {
        value: 0,
        label: "否",
      },
    ]);
    // 通知发送时间
    const notificationSendTime = ref();
    // 后端-请求会议详细信息
    const fetchMeetingDetail = async (meetingId) => {
      const meeting = meetings.value.find((meeting) => meeting.meetingId === meetingId);
      try {
        // currentMeeting.value = meetings.value.find(
        //   (meeting) => meeting.meetingId === meetingId
        // );
        currentMeeting.value.meetingId = meetingId;
        const response = await axios
          .get("/meeting/meeting/online/query/" + meetingId)
          .then((response) => {
            const data = response.data;
            if (data.code === 200) {
              currentMeeting.value = data.data;
              currentMeeting.value.meetingId = meetingId;
            }
          })
          .catch((error) => {
            console.log(error);
          });
        meetingTimeRange.value = [
          new Date(currentMeeting.value.meeting.meetingStartTime),
          new Date(currentMeeting.value.meeting.meetingEndTime),
        ];
        meetingEntryTime.value = new Date(currentMeeting.value.meeting.meetingEntryTime);
        notificationSendTime.value = new Date(currentMeeting.value.notification.sendTime);
        currentMeeting.value.meeting.meetingType = meeting.meetingType;
        dialogMeetingDetail.value = true;
      } catch (error) {
      } finally {
      }
    };
    // 使用currentMeeting删除对象，统一由下一步“更新”来提交后端
    const deleteParticipate = async (index, row) => {
      currentMeeting.value.participant.splice(index, 1);
    };
    // 用户信息
    // const userInfo = ref([
    //   {
    //     userId: 427388197,
    //     username: "7",
    //     nickname: "8",
    //   },
    //   {
    //     userId: 427388198,
    //     username: "11",
    //     nickname: "22",
    //   },
    // ]);
    const userInfo = ref([]);
    // 加载-用户信息
    const userInfoLoading = ref(false);
    // 查询用户信息
    const userInfoSearch = async (keyword) => {
      userInfoLoading.value = true;
      try {
        const response = await axios
          .post("/user/user/query", {})
          .then((response) => {
            const data = response.data;
            if (data.code === 200) {
              userInfo.value = data.data.filter((user) =>
                user.username.includes(keyword)
              );
              // console.log(userInfo.value);
            }
          })
          .catch((error) => {
            console.log(error);
          });
      } catch (error) {
      } finally {
        userInfoLoading.value = false;
      }
    };
    // 选择器搜索绑定ref事件
    const userSelect = ref(null);
    // 添加参会者进入currentMeeting对象，统一由下一步“更新”来提交后端
    const addParticipants = async (selectedValues) => {
      // console.log(selectedValues);
      selectedValues.forEach((value) => {
        const user = userInfo.value.find((user) => user.username === value);
        if (user) {
          const newParticipant = {
            userId: user.id,
            username: user.username,
            nickname: user.nickname,
            joinTime: null,
          };
          // 检查是否存在相同的参与者对象
          console.log("4", currentMeeting.value.participant);

          const isDuplicate = currentMeeting.value.participant.some(
            (participant) =>
              participant.userId === newParticipant.userId &&
              participant.username === newParticipant.username &&
              participant.nickname === newParticipant.nickname
          );
          // 检查是否超过座位限制
          const isWithinLimit =
            currentMeeting.value.participant.length <=
            currentMeeting.value.meeting.meetingSeatLimit;
          if (!isDuplicate && isWithinLimit) {
            currentMeeting.value.participant.push(newParticipant);
            console.log(currentMeeting.value.participant);
          } else if (!isWithinLimit) {
            ElMessage.error("已达到会议的最大座位限制，无法添加更多参会者");
          } else if (isDuplicate) {
            ElMessage.warning("该参会者已被您加入会议");
          }
        }
      });
      // 关闭选择器
      userSelect.value.blur();
    };
    // 是否禁用弹出层里面内容
    const dialogIsDisabled = computed(() => {
      // 数据类型不一致供调试
      // return userId !== currentMeeting.value.meeting.meetingCreatorId && currentTime.isBefore(meetingEntryTime);
      return (
        Number(userId) !== currentMeeting.value.meeting.meetingCreatorId ||
        currentMeeting.value.meeting.meetingStatus !== 0 ||
        currentMeeting.value.meeting.meetingType === "线下"
      );
    });
    // 更新会议，并退出弹窗
    const updateMeeting = async () => {
      dialogMeetingDetail.value = false;
      // console.log(currentMeeting.value);
      const meetingId = currentMeeting.value.meetingId;
      // console.log(userInfo.value);
      const participant = currentMeeting.value.participant;
      // userInfo.value = currentMeeting.value.participant;

      try {
        const response = await axios
          .put(
            "/meeting/meeting/online/update/" +
              meetingId +
              "/" +
              currentMeeting.value.notification.notificationId,
            {
              subject: currentMeeting.value.meeting.meetingSubject,
              description: currentMeeting.value.meeting.meetingDescription,
              creatorId: currentMeeting.value.meeting.meetingCreatorId,
              entryTime: meetingEntryTime.value,
              startTime: meetingTimeRange.value[0],
              endTime: meetingTimeRange.value[1],
              seatLimit: currentMeeting.value.meeting.meetingSeatLimit,
              sceneType: currentMeeting.value.meeting.meetingSceneType,
              isScreencap: currentMeeting.value.meeting.isScreencap,
              notificationContent: currentMeeting.value.notification.notificationContent,
              sendTime: notificationSendTime.value,
            }
          )
          .then((response) => {
            const data = response.data;
            if (data.code === 200) {
              currentMeeting.value.meetingId = meetingId;
              // console.log(userInfo.value);
              // console.log(currentMeeting.value.participant);

              currentMeeting.value.participant = participant;
              // 先提交修改，后修改参会者
              createMeetingInvite();
              // ElMessage.success("修改会议成功");
            } else {
              ElMessage.error(data.msg);
            }
          });
      } catch (error) {}
    };
    // 按钮-去创建会议
    const buttonCreateMeeting = async () => {
      dialogCreateMeeting.value = true;
      // meetingTimeRange.value = [
      //   new Date(currentMeeting.value.meeting.meetingStartTime),
      //   new Date(currentMeeting.value.meeting.meetingEndTime),
      // ];
      // meetingEntryTime.value = new Date(
      //   currentMeeting.value.meeting.meetingEntryTime
      // );
      // notificationSendTime.value = new Date(
      //   currentMeeting.value.notification.sendTime
      // );
      currentMeeting.value = {
        meetingId: null,
        meetingType: null,
        meeting: {
          meetingNum: "",
          meetingSubject: "",
          meetingDescription: "",
          meetingCreatorId: userId,
          meetingEntryTime: "",
          meetingStartTime: "",
          meetingEndTime: "",
          meetingStatus: 0,
          createTime: null,
          meetingSeatLimit: 100,
          meetingSceneType: "无",
          sponsorSigninStatus: 0,
          sponsorSigninTime: null,
          compereId: userId,
          isScreencap: 0,
          meetingLink: "",
        },
        notification: {
          notificationId: null,
          notificationContent: "",
          senderId: userId,
          sendTime: "",
          sendStatus: 0,
        },
        participant: [],
        room: {
          roomId: "",
          meetingPlace: "",
          meetingNum: "",
          meetingSeatLimit: 100,
          meetingEntryTime: "",
          meetingStartTime: "",
          meetingEndTime: "",
        },
        place_id: [
          {
            value: "科技楼",
            label: "科技楼",
            children: [
              {
                value: "1001",
                label: "1001",
              },
              {
                value: "1002",
                label: "1002",
              },
            ],
          },
          {
            value: "博学楼",
            label: "博学楼",
            children: [
              {
                value: "501",
                label: "501",
              },
              {
                value: "506",
                label: "506",
              },
            ],
          },
        ],
        isCache: 0,
      };
      meetingTimeRange.value = "";
      meetingEntryTime.value = "";
      notificationSendTime.value = "";
    };
    // 弹窗-去创建会议
    const dialogCreateMeeting = ref(false);
    // 创建会议（会议、通知）
    const createMeeting = async () => {
      // dialogCreateMeeting.value = false;
      const participant = currentMeeting.value.participant;
      if (participant.length === 0) {
        ElMessage.error("请选择参会者");
        return;
      }

      if (participant.length > currentMeeting.value.meeting.meetingSeatLimit) {
        ElMessage.error("人数超出限制");
        return;
      }
      try {
        const response = await axios
          .post("/meeting/meeting/online/create", {
            subject: currentMeeting.value.meeting.meetingSubject,
            description: currentMeeting.value.meeting.meetingDescription,
            creatorId: userId,
            entryTime: meetingEntryTime.value,
            startTime: meetingTimeRange.value[0],
            endTime: meetingTimeRange.value[1],
            seatLimit: currentMeeting.value.meeting.meetingSeatLimit,
            sceneType: "无",
            isScreencap: currentMeeting.value.meeting.isScreencap,
            notificationContent: currentMeeting.value.notification.notificationContent,
            sendTime: notificationSendTime.value,
          })
          .then((response) => {
            console.log(response);
            const data = response.data;
            if (data.code === 200) {
              currentMeeting.value.meetingId = data.data.meetingId;
              currentMeeting.value.participant = participant;
              // 先创建会议后邀请
              createMeetingInvite();
            } else {
              ElMessage.error(data.msg);
            }
          });
      } catch (error) {
        console.log(error);
        ElMessage.error("创建会议失败");
      }
    };
    // 创建会议（邀请参会者）
    const createMeetingInvite = async () => {
      const userArray = currentMeeting.value.participant.map((user) => user.userId);

      try {
        const response = await axios
          .post("/meeting/meetingParticipant/online/invite", {
            meetingId: currentMeeting.value.meetingId,
            creatorId: userId,
            userId: userArray,
          })
          .then((response) => {
            const data = response.data;
            if (data.code === 200) {
              ElMessage.success("成功");
              meetingTimeRange.value = [];
              meetingEntryTime.value = null;
              // 刷新
              dialogCreateMeeting.value = false;
              init();
            } else {
              console.log(data);
              ElMessage.error(data.msg);
            }
          });
      } catch (error) {
        console.log(error);
      } finally {
      }
    };
    // 按钮-去创建线下会议
    const buttonOfflineCreateMeeting = async () => {
      dialogOfflineCreateMeeting.value = true;
      currentMeeting.value = {
        meetingId: null,
        meetingType: null,
        meeting: {
          meetingNum: "",
          meetingSubject: "",
          meetingDescription: "",
          meetingCreatorId: userId,
          meetingEntryTime: "",
          meetingStartTime: "",
          meetingEndTime: "",
          meetingStatus: 0,
          createTime: null,
          meetingSeatLimit: 100,
          meetingSceneType: "无",
          sponsorSigninStatus: 0,
          sponsorSigninTime: null,
          compereId: userId,
          isScreencap: 0,
          meetingLink: "",
        },
        notification: {
          notificationId: null,
          notificationContent: "",
          senderId: userId,
          sendTime: "",
          sendStatus: 0,
        },
        participant: [],
        room: {
          roomId: "",
          meetingPlace: "",
          meetingNum: "",
          meetingSeatLimit: 100,
          meetingEntryTime: "",
          meetingStartTime: "",
          meetingEndTime: "",
          description: "",
        },
        place_id: [
          {
            value: "科技楼",
            label: "科技楼",
            children: [
              {
                value: "1001",
                label: "1001",
              },
              {
                value: "1002",
                label: "1002",
              },
            ],
          },
          {
            value: "博学楼",
            label: "博学楼",
            children: [
              {
                value: "501",
                label: "501",
              },
              {
                value: "506",
                label: "506",
              },
            ],
          },
        ],
        isCache: 0,
      };
      meetingTimeRange.value = "";
      meetingEntryTime.value = "";
      notificationSendTime.value = "";
    };
    // 弹窗-去创建线下会议
    const dialogOfflineCreateMeeting = ref(false);
    // 创建线下会议（会议室、会议、通知）
    const offlineCreateMeeting = async () => {
      // 会议室审批通过后，先创建会议后邀请
      if (selectedPlace.value === "") {
        ElMessage.error("请选择会议室");
        return;
      }

      if (currentMeeting.value.participant.length === 0) {
        ElMessage.error("请选择参会者");
        return;
      }

      if (
        currentMeeting.value.room.meetingSeatLimit > selectedPlace.seatLimit ||
        currentMeeting.value.room.meetingSeatLimit <
          currentMeeting.value.participant.length
      ) {
        ElMessage.error("人数超出限制");
        return;
      }

      const participant = currentMeeting.value.participant;
      console.log("participant", participant);

      try {
        console.log("currentMeeting", currentMeeting.value);
        // console.log("meetingEntryTime", meetingEntryTime.value);
        // console.log("startTime", meetingTimeRange.value[0]);
        // console.log("endTime", meetingTimeRange.value[1]);
        // console.log("notificationSendTime", notificationSendTime.value);

        const response = await axios.post("/meeting/meeting/offline/create", {
          subject: currentMeeting.value.meeting.meetingSubject,
          description: currentMeeting.value.meeting.meetingDescription,
          creatorId: userId,
          entryTime: meetingEntryTime.value,
          startTime: meetingTimeRange.value[0],
          endTime: meetingTimeRange.value[1],
          seatLimit: currentMeeting.value.room.meetingSeatLimit,
          sceneType: "无",
          isScreencap: currentMeeting.value.meeting.isScreencap,
          notificationContent: currentMeeting.value.notification.notificationContent,
          sendTime: notificationSendTime.value,
        });
        const data = response.data;
        console.log(data);

        if (data.code !== 200) {
          ElMessage.error(data.msg);
        } else {
          globalMeetingId.value = data.data.meetingId;
          currentMeeting.value.meetingId = data.data.meetingId;
          currentMeeting.value.participant = [...participant];
          console.log(
            "currentMeeting.value.participant",
            currentMeeting.value.participant
          );
          // 临时会议时间
          const tempMeetingTimeRange = meetingTimeRange.value;
          // 先创建会议后邀请
          createMeetingInvite();

          console.log(globalMeetingId);

          // 申请会议室
          const submitRoom = await axios
            .post("/meeting/room/application/submit", {
              roomId: selectedPlace.id,
              applicationId: userId,
              uniId: uniId,
              applicationStartTime: tempMeetingTimeRange[0],
              applicationEndTime: tempMeetingTimeRange[1],
              purpose: currentMeeting.value.room.description,
              meetingId: globalMeetingId.value,
            })
            .then((response) => {
              const data = response.data;
              if (data.code === 200) {
                ElMessage.success("申请线下会议室成功");
              } else {
                ElMessage.error(data.msg);
              }
            });
          dialogOfflineCreateMeeting.value = false;
        }
      } catch (error) {
        console.log(error);
        ElMessage.error("申请线下会议失败");
      } finally {
      }
    };
    // 点击-进入会议
    const entryMeeting = async (meetingId) => {
      const meeting = meetings.value.find((meeting) => meeting.meetingId === meetingId);
      // 如果meeting不为空，检测它的meetingType是不是1
      if (meeting && meeting.meetingType === "线下") {
        try {
          const response = await axios.get("/meeting/room/application", {
            headers: {
              "Content-Type": "application/x-www-form-urlencoded",
            },
            params: {
              userId: userId,
              uniId: uniId,
              page: 1,
              size: 1000,
            },
          });
          let selectedMeeting = null;
          if (response.data.code === 200) {
            console.log(response.data.data);

            const records = response.data.data.records;
            records.forEach((item) => {
              if (item.meetingId === meetingId) {
                selectedMeeting = item;
                return;
              }
            });
          }
          if (selectedMeeting.applicationStatus === 1) {
            router.push({
              path: "/zego",
              query: { linkId: meetingId, userId: userId },
            });
          } else {
            ElMessage.error("线下会议室未审核通过");
            return;
          }
        } catch (error) {
          console.log(error);
          ElMessage.error("线下会议室未审核通过");
        }
      } else {
        router.push({
          path: "/zego",
          query: { linkId: meetingId, userId: userId },
        });
      }
    };
    // 会议室数据
    const roomOptions = ref([
      {
        value: "科技楼",
        label: "科技楼",
        children: [
          {
            value: "1001",
            label: "1001",
          },
          {
            value: "1002",
            label: "1002",
          },
        ],
      },
      {
        value: "博学楼",
        label: "博学楼",
        children: [
          {
            value: "501",
            label: "501",
          },
          {
            value: "506",
            label: "506",
          },
        ],
      },
    ]);
    // 弹窗-查询审批进度
    const dialogOfflineSelectSchedule = ref(false);
    // 分页总条数-查询审批进度
    const totalApplication = ref(0);
    // 按钮-查询审批进度
    const buttonOfflineSelectSchedule = async () => {
      dialogOfflineSelectSchedule.value = true;

      try {
        const response = await axios.get("/meeting/room/application", {
          headers: {
            "Content-Type": "application/x-www-form-urlencoded",
          },
          params: {
            userId: userId,
            uniId: uniId,
            page: 1,
            size: 5,
          },
        });
        let selectedMeeting = null;
        if (response.data.code === 200) {
          totalApplication.value = response.data.data.total;
          applicationInfo.value = response.data.data.records.map((record) => ({
            ...record,
            applicationTimeRange: [
              new Date(record.applicationStartTime),
              new Date(record.applicationEndTime),
            ],
            approvalTime: new Date(record.approvalTime),
          }));
          console.log(applicationInfo.value);
        }
      } catch (error) {
        console.log(error);
      }

      // meetingTimeRange.value = [
      //   new Date(currentMeeting.value.room.meetingStartTime),
      //   new Date(currentMeeting.value.room.meetingEndTime),
      // ];
      // approvalTime.value = new Date(currentMeeting.value.application.approvalTime);
    };
    // 审批信息
    const applicationInfo = ref([]);
    // 审批时间
    const approvalTime = ref();
    // 弹窗状态-会议纪要
    const dialogAssistance = ref(false);
    // 按钮-去生成纪要
    const buttonAssistance = async () => {
      dialogAssistance.value = true;
      meetingDatas.value = [];
      meetings.value.forEach((meeting) => {
        const formattedStartTime = moment(meeting.meetingStartTime).format(
          "YYYY-MM-DD HH:mm:ss"
        );

        meetingDatas.value.push({
          meetingId: meeting.meetingId,
          meetingSubject: meeting.meetingSubject,
          meetingDescription: `${meeting.meetingDescription} - ${formattedStartTime}`,
        });
      });
    };
    // 选择器默认数据
    const valueAssistance = ref("");
    // 选择器内容
    const meetingDatas = ref([]);
    // 按钮-点击生成纪要和摘要
    const createTask = async () => {
      try {
        const selectedMeeting = meetingDatas.value.find(
          (meeting) => meeting.meetingId === valueAssistance.value
        );
        // console.log(selectedMeeting.meetingId);

        // 得到文件的url(死数据)
        const getUrl = await axios.get("/file/file/getPresignedUrl", {
          params: {
            fileName: "/ecm/" + 1 + "/" + "1.mp4",
          },
        });
        if (getUrl.data.code != 200) {
          ElMessage.error("获取文件url失败");
          return;
        }

        // 得到url
        const url = getUrl.data.data.url;

        // 使用获取到的URL创建任务
        const params = new URLSearchParams();
        params.append("meetingId", selectedMeeting.meetingId);
        params.append("url", url);
        const createTaskResponse = await axios.post("/meeting/test/createTask", params, {
          headers: {
            "Content-Type": "application/x-www-form-urlencoded",
          },
        });

        if (createTaskResponse.data.code === 643) {
          ElMessage.info("会议纪要分析完成，请前去查看");
          return;
        }
        console.log(createTaskResponse.data);
        ElMessage.success("任务创建成功");
      } catch (error) {
        console.log(error);
        ElMessage.error("创建任务失败，请确保会议已结束");
      }
    };
    // 弹出层-查看纪要
    const dialogSelectAssistance = ref(false);
    // 按钮-去查看纪要
    const buttonSelectAssistance = async () => {
      dialogSelectAssistance.value = true;
      meetingDatas.value = [];
      meetings.value.forEach((meeting) => {
        const formattedStartTime = moment(meeting.meetingStartTime).format(
          "YYYY-MM-DD HH:mm:ss"
        );

        meetingDatas.value.push({
          meetingId: meeting.meetingId,
          meetingSubject: meeting.meetingSubject,
          meetingDescription: `${meeting.meetingDescription} - ${formattedStartTime}`,
        });
      });
    };
    // 按钮-点击查看纪要和摘要生成进度
    const getTaskInfo = async () => {
      showAssistance.value = false;
      summarizationData.value = {};
      meetingAssistanceData.value = {};
      const selectedMeeting = meetingDatas.value.find(
        (meeting) => meeting.meetingId === valueAssistance.value
      );
      try {
        const response = await axios.get("/meeting/test/getTaskId", {
          params: {
            meetingId: selectedMeeting.meetingId,
          },
        });
        if (response.data.code !== 200) {
          ElMessage.error("获取任务ID失败");
          return;
        }

        const taskId = response.data.data;
        const getTaskInfoParams = new URLSearchParams();
        getTaskInfoParams.append("meetingId", selectedMeeting.meetingId);
        getTaskInfoParams.append("taskId", taskId);
        const getTaskInfoResponse = await axios.post(
          "/meeting/test/getTaskInfo",
          getTaskInfoParams,
          {
            headers: {
              "Content-Type": "application/x-www-form-urlencoded",
            },
          }
        );
        // console.log(getTaskInfoResponse);

        if (getTaskInfoResponse.data.code === 645) {
          ElMessage.info("正在分析任务信息，请稍后查看");
          return;
        }

        const data = getTaskInfoResponse.data.data;
        // 摘要url
        const summarization = data.summarization;
        // 纪要url
        const meetingAssistance = data.meetingAssistance;

        // 请求摘要url得到内容
        const summarizationResponse = await axios.get(summarization);
        if (summarizationResponse.status !== 200) {
          ElMessage.error("获取摘要内容失败");
          return;
        }
        summarizationData.value = {
          // 段落总结
          ParagraphSummary: summarizationResponse.data.Summarization.ParagraphSummary,
          // 段落标题
          ParagraphTitle: summarizationResponse.data.Summarization.ParagraphTitle,
        };
        console.log("全文总结", summarizationData.value);

        // 请求纪要url得到内容
        const meetingAssistanceResponse = await axios.get(meetingAssistance);
        // console.log(meetingAssistanceResponse);
        if (meetingAssistanceResponse.status !== 200) {
          ElMessage.error("获取纪要内容失败");
          return;
        }
        // 关键词出现语句临时变量
        const meetingAssistanceDataFromResponse =
          meetingAssistanceResponse.data.MeetingAssistance;

        meetingAssistanceData.value = {
          // 纪要关键词
          Keywords: Array.isArray(meetingAssistanceDataFromResponse.Keywords)
            ? meetingAssistanceDataFromResponse.Keywords.map((keyword) => ({
                value: keyword,
              }))
            : [],
          // 关键词出现语句
          KeySentences:
            meetingAssistanceDataFromResponse.KeySentences &&
            meetingAssistanceDataFromResponse.KeySentences.length > 0
              ? meetingAssistanceDataFromResponse.KeySentences
              : [],
        };
        console.log("纪要信息", meetingAssistanceData.value);

        showAssistance.value = true;
      } catch (error) {
        console.log(error);
        ElMessage.error("获取任务信息失败，请先确认是否创建生成纪要任务");
      }
    };
    // 得到的摘要对象
    const summarizationData = ref({});
    // 得到的纪要对象
    const meetingAssistanceData = ref({});
    // 是否出现摘要和纪要的表格
    const showAssistance = ref(false);
    // 弹窗关闭后恢复默认数据-纪要生成-选择纪要
    watch(dialogAssistance, (newValue) => {
      if (!newValue) {
        valueAssistance.value = "";
      }
    });
    // 弹窗关闭后恢复默认数据-查看纪要-选择纪要
    watch(dialogSelectAssistance, (newValue) => {
      if (!newValue) {
        valueAssistance.value = "";
        showAssistance.value = false;
        console.log(summarizationData);

        summarizationData.value = {};
        meetingAssistanceData.value = {};
      }
    });
    // 学校ID
    const uniId = localStorage.getItem("uniId");
    // 得到线下会议室信息
    const placeInfoSearch = async (keyword) => {
      placeInfo.value = {};
      try {
        const response = await axios.get("/meeting/room/info/" + uniId, {});
        if (response.data.code !== 200) {
          ElMessage.error("获取线下会议室信息失败");
          return;
        }
        const data = response.data.data;
        placeInfo.value = data
          .map((item) => ({
            ...item,
            locationNum: `${item.location}-${item.num}`,
          }))
          .filter((item) => item.locationNum.includes(keyword));
        // console.log(placeInfo.value);
      } catch (error) {}
    };
    // 会议室选择器
    const placeSelect = ref(null);
    // 会议室得到的所有数据
    const placeInfo = ref({});
    // 处理选择线下会议室
    const addPlace = async (selectedValues) => {
      // selectedValues.forEach((value) => {
      const place = placeInfo.value.find((place) => place.id === selectedValues);
      if (place) {
        const newPlace = {
          id: place.id,
          locationNum: place.locationNum,
          seatLimit: place.seatLimit,
          description: currentMeeting.value.room.description,
        };
        currentMeeting.value.room = newPlace;
        // console.log(currentMeeting.value.room);
        selectedPlace = currentMeeting.value.room;

        currentMeeting.value.room.meetingSeatLimit = place.seatLimit;
      }
      // });
    };
    // 已选择的会议室
    let selectedPlace = ref("");
    // 全局meetingId
    const globalMeetingId = ref("");
    // 审批查询分页当前页
    const applicationCurrentPage = ref(1);
    // 审批查询页码
    const applicationPageSize = ref(5);
    // 处理模式不同的审批总数
    const filteredApplicationTotal = computed(() => {
      return totalApplication.value;
      // return applicationInfo.value.length;
    });
    // 处理分页变化
    const applicationPageChange = async (page) => {
      applicationCurrentPage.value = page;
      try {
        const response = await axios.get("/meeting/room/application", {
          headers: {
            "Content-Type": "application/x-www-form-urlencoded",
          },
          params: {
            userId: userId,
            uniId: uniId,
            page: applicationCurrentPage.value,
            size: 5,
          },
        });
        let selectedMeeting = null;
        if (response.data.code === 200) {
          totalApplication.value = response.data.data.total;
          applicationInfo.value = response.data.data.records.map((record) => ({
            ...record,
            applicationTimeRange: [
              new Date(record.applicationStartTime),
              new Date(record.applicationEndTime),
            ],
            approvalTime: new Date(record.approvalTime),
          }));
          console.log(applicationInfo.value);
        }
      } catch (error) {
        console.log(error);
      }
    };
    // 处理审批数据过滤，包含时间、缓存
    const filteredApplicationInfo = computed(() => {
      const start = (applicationCurrentPage.value - 1) * applicationPageSize.value;
      const end = start + applicationPageSize.value;
      return applicationInfo.value.slice(start, end);
    });
    // 计算属性 - 格式化审批状态
    const formattedApplicationStatus = computed(() => {
      return (status) => {
        switch (status) {
          case 0:
            return '待审批';
          case 1:
            return '已批准';
          case 2:
            return '已拒绝';
          default:
            return '待审批'; // 如果状态为空或未知，视为待审批
        }
      };
    });
    // 返回对象
    return {
      userId,
      meetings,
      options,
      selectedOption,
      currentPage,
      pageSize,
      handleSelectOption,
      handlePageChange,
      filteredMeetings,
      filteredMeetingsTotal,
      dialogMeetingDetail,
      currentMeeting,
      meetingTimeRange,
      meetingEntryTime,
      isScreencapOptions,
      notificationSendTime,
      fetchMeetingDetail,
      deleteParticipate,
      userInfo,
      userInfoLoading,
      userInfoSearch,
      addParticipants,
      userSelect,
      dialogIsDisabled,
      updateMeeting,
      createMeeting,
      createMeetingInvite,
      buttonCreateMeeting,
      dialogCreateMeeting,
      dialogOfflineCreateMeeting,
      buttonOfflineCreateMeeting,
      offlineCreateMeeting,
      entryMeeting,
      tableCell,
      roomOptions,
      buttonOfflineSelectSchedule,
      dialogOfflineSelectSchedule,
      approvalTime,
      buttonAssistance,
      dialogAssistance,
      valueAssistance,
      meetingDatas,
      createTask,
      dialogSelectAssistance,
      buttonSelectAssistance,
      getTaskInfo,
      summarizationData,
      meetingAssistanceData,
      showAssistance,
      refreshRightMeeting,
      placeInfoSearch,
      uniId,
      placeInfo,
      addPlace,
      selectedPlace,
      globalMeetingId,
      totalApplication,
      applicationInfo,
      applicationCurrentPage,
      applicationPageSize,
      filteredApplicationTotal,
      applicationPageChange,
      formattedApplicationStatus,
    };
  },
};
</script>

<style>
/* .container {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 60px;
  left: 0;
  background: transparent;
} */

.mx-1 {
  position: absolute;
  left: 25vh;
  top: 6vh;
  /* 优先级 */
  z-index: 1;
}

.recent-meeting {
  position: absolute;
  left: 25vh;
  top: 13vh;
}

.online-card {
  width: 50vh;
}

.offline-card {
  width: 60vh;
}

/* 滚动条整体样式 */
.recent-meeting::-webkit-scrollbar {
  height: 5px;
  /* 设置滚动条高度（水平滚动条的粗细） */
}

/* 滚动条轨道 */
.recent-meeting::-webkit-scrollbar-track {
  background: #f1f1f1;
  /* 轨道颜色 */
  border-radius: 5px;
}

/* 滚动条滑块 */
.recent-meeting::-webkit-scrollbar-thumb {
  background: #888;
  /* 滑块颜色 */
  border-radius: 5px;
}

/* 鼠标悬停在滑块上的样式 */
.recent-meeting::-webkit-scrollbar-thumb:hover {
  background: #555;
  /* 滑块悬停颜色 */
}

.mode-button {
  position: absolute;
  left: 38vh;
  top: 8.5vh;
  /* 优先级 */
  z-index: 1;
}

.refreshRight {
  position: absolute;
  left: 50vh;
  top: 8.5vh;
  /* 优先级 */
  z-index: 1;
}

.mx-2 {
  position: absolute;
  left: 25vh;
  top: 38vh;
  /* 优先级 */
  z-index: 1;
}

.create-online-meeting {
  position: absolute;
  left: 25vh;
  top: 45vh;
}

.create-offline-meeting {
  position: absolute;
  left: 56vh;
  top: 45vh;
}

.select-offline-meeting {
  position: absolute;
  left: 87vh;
  top: 45vh;
}

.resource-manage {
  position: absolute;
  left: 118vh;
  top: 42vh;
}

.status-blue {
  color: #409eff;
}

.status-green {
  color: #67c23a;
}

.status-red {
  color: #f56c6c;
}

.status-yellow {
  color: #f08200;
}

.line {
  width: 2px;
  background-color: var(--el-border-color);
  margin: 0 10px;
  /* 设置左右间隔 */
}

.warning-cell {
  background-color: #fffaf6;
}

.success-cell {
  background-color: #f5f9ff;
}

.status-gray {
  color: #909399;
}

.mx-3 {
  position: absolute;
  left: 25vh;
  top: 64vh;
  /* 优先级 */
  z-index: 1;
}

.minutes-manage {
  position: absolute;
  left: 25vh;
  top: 71vh;
}

.minutes-manage-info {
  position: absolute;
  left: 56vh;
  top: 71vh;
}

.manuscript {
  position: absolute;
  left: 87vh;
  top: 71vh;
}

.manuscript-info {
  position: absolute;
  left: 118vh;
  top: 71vh;
}

.custom-dialog .el-dialog__body {
  max-height: calc(60vh);
  /* 根据需要调整高度 */
  overflow-y: auto;
  padding-right: 5vh;
}

/* 滚动条整体样式 */
.custom-dialog .el-dialog__body::-webkit-scrollbar {
  width: 5px;
  /* 设置滚动条高度（垂直滚动条的粗细） */
}

/* 滚动条轨道 */
.custom-dialog .el-dialog__body::-webkit-scrollbar-track {
  background: #f1f1f1;
  /* 轨道颜色 */
  border-radius: 5px;
}

/* 滚动条滑块 */
.custom-dialog .el-dialog__body::-webkit-scrollbar-thumb {
  background: #888;
  /* 滑块颜色 */
  border-radius: 5px;
}

/* 鼠标悬停在滑块上的样式 */
.custom-dialog .el-dialog__body::-webkit-scrollbar-thumb:hover {
  background: #555;
  /* 滑块悬停颜色 */
}
</style>
